<template>
  <div>
    <div class="flims-list">
      <div class="list-warp">
        <ul>
          <a href="电影详情.html" v-for="(item, index) in films" :key="index">
            <li>
              <img :src="item.poster" alt="" />
              <div class="info">
                <p class="name">
                  {{ item.name }}
                  <span>{{ item.filmType.name }}</span>
                </p>
                <p class="score">
                  <span class="label">观众评分</span>
                  <span class="grade">{{ item.grade }}</span>
                </p>
                <p class="actors">
                  <span
                    class="label"
                    v-for="(item2, index2) in item.actors"
                    :key="index2"
                    >主演：{{ item2.name }}</span
                  >
                </p>
                <p class="detail">
                  <span class="label"
                    >{{ item.nation }} | {{ item.runtime }}分钟</span
                  >
                </p>
              </div>
              <div class="play">购票</div>
            </li>
          </a>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: "nowPlaying",
  data() {
    return {
      films: [],
    };
  },

  mounted() {
    this.getData();
  },

  methods: {
    getData() {
      axios({
        url: "https://m.maizuo.com/gateway",
        method: "get",
        params: {
          cityId: 110100,
          pageNum: 1,
          pageSize: 10,
          type: 1,
          k: 2694986,
        },
        headers: {
          "X-Client-Info":
            '{"a":"3000","ch":"1002","v":"5.0.4","e":"16179368764092240544661505","bc":"110100"}',
          "X-Host": "mall.film-ticket.film.list",
        },
        // dataType: "json",
      }).then((res) => {
        // console.log(res);
         const films = res.data.data.films;
        //  console.log(films);
         this.films=films
      }); 
    },
  },
};
</script>

<style>
</style>